<template>
  <div
    id="image"
    :style="{
      'margin-bottom': Object.keys(getMusic).length == 0 ? '50px' : '116px',
    }"
  >
    <div v-for="item in images" :key="item.id">
      <img :src="item.img" alt="" />
    </div>
    <TabBar />
  </div>
</template>

<script>
// 每个栏目都需要
import { mapGetters } from "vuex"; //播放器状态
import TabBar from "@/components/common/TabBar";
import { ifTabBar } from "@/common/mixin";

// api
import { getImages } from "@/api/image";

export default {
  data() {
    return {
      images: [],
    };
  },
  components: {
    TabBar,
  },
  computed: {
    ...mapGetters(["getMusic", "getAudio"]),
  },
  mixins: [ifTabBar],
  created() {
    getImages().then((res) => {
      this.images = res.result;
      console.log(res.result);
    });
  },
  methods: {},
};
</script>

<style lang='less' scoped>
#image {
  width: 100%;
  img {
    width: 100%;
  }
}
</style>
